<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
	<th:block th:include="include :: header('主页')" />
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
	<div class="row">
		<div class="col-sm-3">
			<a href="/system/CasePersonalInfo">
				<div class="panel panel-default">
					<div class="panel-heading">
						<i class="fa fa-warning"></i> 基本状况
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_basic.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
		<div class="col-sm-3">
			<a href="/system/CaseHealthCondition">
				<div class="panel panel-primary">
					<div class="panel-heading">
						<i class="fa fa-warning"></i> 健康状况
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_info.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
		<div class="col-sm-3">
			<a href="/system/CaseFamilyMembers">
				<div class="panel panel-success">
					<div class="panel-heading">
						<i class="fa fa-warning"></i> 家庭成员
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_family.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
		<div class="col-sm-3">
			<a href="/system/CaseDangerExposure">
				<div class="panel panel-info">
					<div class="panel-heading">
						<i class="fa fa-info-circle"></i> 病例发现
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_find.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
	</div>
	<div class="row">
		<div class="col-sm-3">
			<a href="/system/CaseVaccination">
				<div class="panel panel-warning">
					<div class="panel-heading">
						<i class="fa fa-warning"></i> 接种信息
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_inject.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
		<div class="col-sm-3">
			<a href="/system/CaseTravelTrajectory">
				<div class="panel panel-danger">
					<div class="panel-heading">
						<i class="fa fa-warning"></i> 行程轨迹
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_traj.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
		<div class="col-sm-3">
			<a onclick="covidra()">
				<div class="panel panel-default">
					<div class="panel-heading">
						<i class="fa fa-warning"></i> 风险区域
					</div>
					<div class="panel-body">
						<img th:src="@{/img/main_ra.png}" width="100%" height="100%">
					</div>
				</div>
			</a>
		</div>
	</div>
</div>
<th:block th:include="include :: footer" />
<script type="text/javascript">
	function animationHover(element, animation) {
		element = $(element);
		element.hover(
				function () {
					element.addClass('animated ' + animation);
				},
				function () {
					//动画完成之前移除class
					window.setTimeout(function () {
						element.removeClass('animated ' + animation);
					}, 2000);
				});
	};
	$(document).ready(function () {
		$('.col-sm-4').each(function () {
			animationHover(this, 'pulse');
		});
	});
	function covidra(){
		window.open("https://zolty.gitee.io/covid-19_ra/");
	}
</script>
</body>
</html>